<template>
  <div>
    <CategorySelector :disabled="isShow !== 1"></CategorySelector>
    <SpuList
      v-if="isShow === 1"
      @isShowAddSpu="isShow = $event"
      @setSpu="spu = $event"
    ></SpuList>
    <AddSetSpuItem
      v-else-if="isShow === 2"
      @isShowAddSpu="isShow = $event"
      :spu="spu"
    ></AddSetSpuItem>
    <AddSku v-else @isShowAddSpu="isShow = $event" :spu="spu"></AddSku>
  </div>
</template>

<script lang="ts">
export default {
  name: "ProductSpu",
};
</script>

<script lang="ts" setup>
import { ref } from "vue";
import type { AddSetSpuListItem } from "@/api/product/models/spuModel";
import CategorySelector from "@/components/CategorySelector";
import SpuList from "@/views/product/spu/components/Spulist";
import AddSetSpuItem from "@/views/product/spu/components/AddSetSpuItem";
import AddSku from "@/views/product/spu/components/AddSku";

enum IsShow {
  "SpuList" = 1,
  "AddSetSpuItem" = 2,
  "AddSku" = 3,
}

const isShow = ref<IsShow>(1);

//定义SpuList发过来的单条spu数据
const spu = ref<AddSetSpuListItem>({
  description: "",
  spuImageList: [],
  spuName: "",
  spuSaleAttrList: [],
  tmId: undefined,
});
</script>

<style scoped></style>
